.side-menus .header,
.alon-header {
    display: flex;
    align-items: baseline;

    .label {
        height: 14px;
        border-left: 2px solid #f21818;
        padding-left: 8px;
        font-size: 14px;
        font-weight: 500;
        color: #333;
        line-height: 14px;
        margin-right: 10px;
    }

    .ant-btn-primary {
        margin-left: auto;
    }
}

.side-menus {
    height: 100%;
    background: rgb(255, 255, 255);
    padding: 24px 10px 0px 20px;
    overflow-y: auto;

    .side {
        .ant-tree {
            li.ant-tree-treenode-switcher-close {
                padding: 0 0 4px 0 !important;
            }
        }

        padding-top: 15px;

        .edit-node {
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-weight: 500;

            .edit-node-title {
                color: #333;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
        }

        .admin-treenode {
            .className {
                .ant-tree-switcher-noop {
                    display: none !important;
                }

                .ant-tree-node-content-wrapper {
                    width: 100%;
                    max-width: 100%;
                }
            }
        }

        .fill-treenode {
            padding-top: 10px;

            li {
                padding-top: 0px;
            }

            .ant-tree-child-tree {
                padding-top: 2px;
            }

            .ant-tree-node-content-wrapper {
                width: calc(100% - 24px);
            }

            .ant-tree-node-content-wrapper {
                &:hover,
                &.ant-tree-node-selected {
                    background-color: transparent !important;
                }

                &.ant-tree-node-selected {
                    .ant-tree-title,
                    .edit-node-title {
                        color: #f21818;
                    }
                }
            }

            .ant-tree-switcher {
                .anticon {
                    color: #ddd;
                }
            }
        }
    }

    .edit-operation {
        color: #ddd;

        .anticon {
            margin-left: 8px;
        }
    }
}

.ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
    // background-color: #ffeae6;
}

.content-table {
    table {
        thead {
            th {
                background: #ededed !important;
            }
        }

        tbody {
            td {
                padding: 10px 16px !important;
                border-bottom: solid 1px #ededed;
            }
        }
    }
}

.layui-card-header {
    position: relative;
    height: 42px;
    line-height: 42px;
    padding: 0 15px;
    border-bottom: 1px solid #f6f6f6;
    color: #333;
    border-radius: 2px 2px 0 0;
    font-size: 14px;
}

.drawer-handle {
    position: fixed;
    top: 60px;
    width: 41px;
    height: 40px;
    cursor: pointer;
    text-align: center;
    line-height: 40px;
    font-size: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    z-index: 101;
}

.webapp-main {
    .drawer-handle {
        display: none;
        left: 180px;
        border-radius: 0 4px 4px 0;
        -webkit-box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
        box-shadow: 2px 0 8px #00000026;

        .apps {
            font-size: 20px;
        }
    }
}

.webapp-main {
    .sidelayout,
    .m-content,
    .drawer-handle,
    .float-bar-wrapper {
        transition: left 0.15s;
    }
}

@media screen and (max-width: 768px) {
    .webapp-main {
        .drawer-handle {
            display: block;
        }

        .sidber-narrow {
            //left: -180px !important;
            margin-left: -180px;
        }

        .content-narrow,
        .drawer-handle-narrow {
            left: 0px !important;

            .float-bar-wrapper {
                left: 0px !important;
            }
        }
    }

    .float-bar-wrapper .float-bar-right .amount-sum {
        display: none;
    }
}
